@extends('layouts.layouts')
@section('content')
    <blockquote class="layui-elem-quote layui-text">
        上传图片格式为297x77
    </blockquote>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>LOGO管理</legend>
    </fieldset>
    <div class="layui-form-item">
        <label class="layui-form-label">现LOGO图</label>
        <div class="layui-input-block">
            <div class="col-lg-2">
                    <img  src="{{$pic->url}}" style="width:auto;max-height:55px;"  alt="logo">
            </div>
        </div>
    </div>
    <form class="layui-form" action="/admin/logo/uploadLogo" method="post">
    <div class="layui-form-item">
        <label class="layui-form-label">上传logo</label>
        <div class="layui-input-block">
            <div class="col-lg-2">
                    <span id="showimg">
                    </span>
                <a href="javascript:;" id="img">
                    <img onerror="this.src='{{asset("assets/images/placeholder.jpg")}}'" src="{{asset('assets/images/placeholder.jpg')}}" data-url="" style="width:auto;max-height:55px;" class="listpic" alt="列表图">
                </a>
            </div>
            {{--<input type="hidden"  name="imgval[]" value="" id="imgval">--}}
            <p id="demoText" style="display: none;">

            </p>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="submit">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
    </form>

@section('script')
    <script>
        //点击图片
        layui.use('upload', function() {
            var $ = layui.jquery, upload = layui.upload;
            //普通图片上传
            var uploadInst = upload.render({
                elem: '#img'
                , url: '/admin/vidotype/uploadOtypeImg'
                , size: 500
                , exts: 'jpg|png|jpeg'
                , multiple: false
                , before: function (obj) {
                        //预读本地文件示例，不支持ie8
                        obj.preview(function (index, file, result) {
                            $('#showimg').append('<img onclick="del_img(this)" name=1 style="width:55px;height:55px;" src="' + result + '">');
                            //$('#showimg').attr('src', result); //图片链接（base64）
                        });
                }
                , done: function (res) {
                    //如果上传失败
                    if (res.code > 0) {
                        return layer.msg('上传失败');
                    }
                    //上传成功
                    if (res.code == 0) {
                        $('#demoText').append('<input type="hidden" id="img"  name="url" value="'+res.data.src+'" >');
                        return layer.msg('上传成功');
                    }
                }
            });
        });
        layui.use('form', function(){
            var form = layui.form,$ = layui.jquery;

            //监听提交
            form.on('submit(submit)', function(data){
//                layer.msg(JSON.stringify(data.field));
//                return false;
                $.ajax({
                    url: data.form.action,
                    type: data.form.method,
                    data: data.field,
                    success: function (res) {
                        if(res.code == 1){
                            layer.msg(res.msg, {icon: 1, time: 1000});
                            window.location.href = "/admin/logo";
                        }else{
                            layer.msg(res.msg, {icon: 2, anim: 6, time: 1000});
                        }
                    }
                });
                return false;
            });
        });
        function del_img(obj){
            name = $(obj).attr('name');
            obj.remove();
            $('#tr'+name).remove();
            $('#img'+name).remove();
        }
    </script>
@endsection
@endsection